@extends('layouts.admin.base')
@section('title', '日志管理')

@section('content')
    <div class="content">
        <!-- 内容主体区域 -->
        <div class="show-area">
            <div class="layui-row">
                <div class="layui-card">
                    <div class="layui-card-header">日志管理</div>
                    <div class="layui-card-body">
                        <div class="layui-row" style="border-bottom: 1px #e9e9e9 solid;padding: 15px 0;" btnPermission="600301">
                            <form id="qryForm" class="layui-form" action="">
                                <div class="layui-form-item">
                                    <div class="layui-input-inline" style="width: 220px;">
                                        <input type="text" name="startdate" class="layui-input" id="startdate" placeholder="开始时间">
                                    </div>
                                    <div class="layui-input-inline" style="width: 15px;">
                                        ~
                                    </div>
                                    <div class="layui-input-inline" style="width: 220px;">
                                        <input type="text" name="enddate" class="layui-input" id="enddate" placeholder="结束时间">
                                    </div>
                                    <div class="layui-input-inline">
                                        <input  style="padding-right: 32px;" type="text" name="keyword" class="layui-input" placeholder="请输入关键字搜索">
                                        <a href="javascript:void(0)" onclick="resetInput()"> <i style="font-size: 18px;position: absolute;top: 9px; right: 6px;cursor: pointer;" class="layui-icon layui-icon-close"></i></a>
                                    </div>
                                    <div class="layui-inline" style="padding-left: 35px;">
                                        <div class="layui-input-inline" style="width: 250px;">
                                            <button id="qryBtn" type="button" lay-filter="formQry" lay-submit class="pear-btn pear-btn-lg pear-btn-primary"><i class="layui-icon layui-icon-search"></i> 查询</button>
                                            <button type="reset" class="pear-btn pear-btn-lg" lay-submit="" lay-filter="reset"><i class="layui-icon layui-icon-refresh"></i>重置</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="layui-row">
                            <div class="layui-table">
                                <table id="datalist" lay-filter="datalist" >
                                </table>
                            </div>
                            <div id="bbar" style="text-align:right;padding-right:25px;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <style>
        .layui-form-label {
            width: 120px;
            font-weight:bold;
        }
        #editWin .layui-form-select dl{
            top: auto;
            bottom: 36px;
        }
    </style>
    <script>
        var totalNUm = 0;
        var per_page = 10;
        var currPage = 1;
        var table;
        var form;
        var laypage;
        var layer;
        var laydate;
        var filters = {};

        $(function(){
            layui.use(['table', 'form', 'element', 'laypage','laydate'], function() {
                table = layui.table;
                element = layui.element;
                form = layui.form;
                laypage = layui.laypage;
                layer = layui.layer;
                laydate = layui.laydate;
                var nowTime = new Date().valueOf();
                var max = null;

                var start = laydate.render({
                    elem: '#startdate',
                    type: 'date',
                    max: nowTime,
                    btns: ['clear', 'confirm'],
                    done: function(value, date){
                        endMax = end.config.max;
                        end.config.min = date;
                        end.config.min.month = date.month -1;
                    },
                    trigger:'click'
                });
                var end = laydate.render({
                    elem: '#enddate',
                    type: 'date',
                    max: nowTime,
                    done: function(value, date){
                        if($.trim(value) == ''){
                            var curDate = new Date();
                            date = {'date': curDate.getDate(), 'month': curDate.getMonth()+1, 'year': curDate.getFullYear()};
                        }
                        start.config.max = date;
                        start.config.max.month = date.month -1;
                    },
                    trigger:'click'
                });

                renderSelect();
                btnEventHandle();

                tableToolsHandle();

                getList(currPage, per_page);

            });
        });

        function renderSelect(){
        }

        function btnEventHandle(){
            // 搜索
            form.on('submit(formQry)', function(data) {
                filters = Object.assign({}, data.field);
                currPage = 1;
                getList(currPage,per_page);
                return false;
            });
            // 重置
//            form.on('submit(reset)', function(data) {
//                filters = {};
//                $('#qryForm')[0].reset();
//                currPage = 1;
//                getList(currPage, per_page);
//            });
        }

        function tableToolsHandle(){
        }

        function getList(page, limit) {
            var para = {
                "page": page,
                "filters": filters,
                "limit": limit
            };

            getLogList(para, function(res) {
                //console.log(res);
                if (res.code == 1) {
                    if(totalNUm != res.total) {
                        totalNUm = res.total;
                        per_page = res.limit;
                        renderPageBar(page,per_page);
                    }
                    table.render({
                        elem: '#datalist',
                        defaultToolbar: [],
                        limit: res.limit,
                        data: res.data,
                        page: false,
                        loading: true,
                        even:true,
                        skin: 'row',
                        cols: [
                            [{
                                field: 'id',
                                title: '序号',
                                templet: function(data){
                                    var curPage = $(".layui-laypage-skip .layui-input").val();
                                    return (curPage-1)*10 + data.LAY_INDEX;
                                },
                                width: '8%',
                            }, {
                                field: 'opusertitle',
                                title: '用户名',
                                width: '14%'
                            }, {
                                field: 'actionname',
                                title: '操作类型',
                                width: '18%'
                            }, {
                                field: 'logcontent',
                                title: '备注',
                                width: '25%',
                                templet: function(d){
                                    return d.eventtypename +':'+ d.logcontent;
                                }
                            }, {
                                field: 'ip',
                                title: '用户IP',
                                width: '15%'
                            }, {
                                field: 'optime',
                                title: '操作时间'
                            }]
                        ],
                        done: function(res, curr, count) {
                            setBtnPermission();
                        }
                    });

                } else {
                    layer.msg(res.msg, {
                        time: 2000,
                        icon: 5
                    });
                }
            })

        }

        // 渲染页面
        function renderPageBar(page,limit) {
            laypage.render({
                elem: 'bbar',
                count: totalNUm, //数据总数，从服务端得到
                curr: page,
                limit:limit,
                first: '第一页',
                last: '最后一页',
                layout: ['limit','count', 'prev', 'page', 'next', 'skip'],
                jump: function(obj, first) {
                    //console.log(obj);
                    //首次不执行
                    if (!first) {
                        layer.closeAll();
                        currPage = obj.curr;
                        getList(obj.curr, obj.limit);
                    }
                }
            });
        }

        function resetInput() {
            $('input[name="keyword"]').val('');
        }
    </script>

@endsection
